<!DOCTYPE html>
<html lang="en">
<!-- 结算页面 -->
<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Amber - Pet Care Bootstrap 5 Template</title>

    <!-- Favicons -->
    <link rel="shortcut icon" href="assets/images/favicon.ico">

    <link rel="stylesheet" href="assets/css/vendor/vendor.min.css">
    <link rel="stylesheet" href="assets/css/plugins/plugins.min.css">
    <link rel="stylesheet" href="assets/css/style.min.css">
	<script src="assets/jquery-3.6.0.min.js"></script>
	<script>
		<!-- 导航栏的JS-开始 -->
		var host = "http://localhost:8083"
		
		//获取二级分类菜单，循环遍历添加菜单
		function getItemCat(){
			$.ajax({
				type:"get",
				url: host + "/itemCat/getAll",
				success: function(result){
					if(result.status == 200){
						//console.log(result.data)
						var itemCatList = result.data
						//遍历一级分类菜单
						for(var i in itemCatList){
							var itemCatOne = itemCatList[i]
							var itemCatOneChildren = itemCatOne.children
							//遍历二级分类菜单
							if(i==0){
								for(var j in itemCatOneChildren){
									var itemCatTwo = itemCatOneChildren[j]
									$("#dog").append(
										`
											<li><a class="a" onclick="dogItem(${itemCatTwo.id})">${itemCatTwo.name}</a></li>
										`
									)
								}
							}
							if(i==1){
								for(var j in itemCatOneChildren){
									var itemCatTwo = itemCatOneChildren[j]
									$("#cat").append(
										`
											<li><a class="a" onclick="catItem(${itemCatTwo.id})">${itemCatTwo.name}</a></li>
										`
									)
								}
							}
							if(i==2){
								for(var j in itemCatOneChildren){
									var itemCatTwo = itemCatOneChildren[j]
									$("#other").append(
										`
											<li><a class="a" onclick="otherItem(${itemCatTwo.id})">${itemCatTwo.name}</a></li>
										`
									)
								}
							}
						}
					}					
				}
			})
		}
		//点击狗狗分类的某一个二级菜单，会获取item表中item_cat_id为此id的商品，并显示在shop.html页面
		function dogItem(id){
			$.ajax(host+`/item/getData/${id}`)
			window.location.href="shop.html"
		}
		//点击猫咪分类的某一个二级菜单，会获取item表中item_cat_id为此id的商品，并显示在shop.html页面
		function catItem(id){
			$.ajax(host+`/item/getData/${id}`)
			window.location.href="shop.html"
		}
		//点击其他分类的某一个二级菜单，会获取item表中item_cat_id为此id的商品，并显示在shop.html页面
		function otherItem(id){
			$.ajax(host+`/item/getData/${id}`)
			window.location.href="shop.html"
		}
		//点击搜索框触发
		function searchItem(){
			let keyword = $("#search").val()
			$.ajax({
				type: "get",
				url: host+"/item/search",
				data: {
					keyword:keyword
				},
				success: function(result){
					if(result.status==200){
						window.location.href = "shop.html"
					}
				}
			})
		}
		//退出登录
		function logout(){
			$.ajax({
				type: "post",
				url: host+"/auth/logout",
				success: function(result){
					if(result.status == 200){
						alert("退出登录成功")
						window.location.href = "index.html"
					}else{
						alert("您还没有登录")
					}
				}
			})	
		}
		/* 登录认证，如果没有登录，就不会跳转到account.html页面 */
		function accountAuth(){
			$.ajax({
				type: "get",
				url: host+"/auth/getAuth",
				success: function(result){
					if(result.status == 200){
						window.location.href = "account.html"
					}else{
						alert("您还没有登录")
					}
				}
			})
		}
		/* 登录认证，如果没有登录，就不会跳转到cart.html页面 */
		function cartAuth(){
			$.ajax({
				type: "get",
				url: host+"/auth/getAuth",
				success: function(result){
					if(result.status == 200){
						window.location.href = "cart.html"
					}else{
						alert("您还没有登录")
					}
				}
			})
		}
		<!-- 导航栏的JS-结束 -->
		//文档就绪
		$(function(){
			//获取萌宠商城导航栏信息
			getItemCat()
			getUser()
			getItem()
		})
		function getUser(){
			$.ajax({
				type: "get",
				url: host+"/buy/getUser",
				success: function(result){
					let user=result.data;
					console.log(user)
					$("#tab1").append(
						`<div class="row">
                            <div class="col-lg-6">
                                <div class="single-input-item m-b-15">
                                    <label for="username" class="required m-b-10">用户名： <br />${user.username}</label>
									
                                </div>
                            </div>
                        </div>
						<hr />
						<div class="single-input-item m-b-15">
							<label for="addr" class="required m-b-10">收货地址: <br />${user.addr}</label>
						</div>
						<hr />
						<div class="single-input-item m-b-15">
							<label for="phone" class="required m-b-10">手机号: <br />${user.phone}</label>
						</div>
						<hr />
						<div class="single-input-item m-b-15">
							<label for="email" class="required m-b-5">邮箱地址: <br />${user.email}</label>
						</div>
						<hr />`
						
					)
				}
			})
		};
		function getItem(){
			$.ajax({
				type: "get",
				url: host+"/buy/getItem",
				success: function(result){
					let item=result.data;
					console.log(item)
					$("#tab2").append(
						`<tr class="cart_item">
						    <td class="cart-product-name text-start ps-0"> 商品名称: ${item.title}</td>
						    <td class="cart-product-total text-end pe-0"><span class="amount">￥${item.price}</span></td>
						</tr>
						`
					)
					
				}
			})
		}
		function pay(){
			alert("支付成功,请继续浏览")
			window.location.href = "index.html"
		}
	</script>
</head>

<body>
    <!-- Header Section Start -->
    <div class="header section">

        <!-- Header Top Start -->
        <div class="header-top bg-name-primary">
            <div class="container">
                <div class="row align-items-center">

					<!-- Header Top Message Start -->
					<div class="col-12 col-lg-6">
					    <div class="header-top-msg-wrapper">
					        <a href="index.html" class="header-top-message">欢迎来到萌宠奇遇!</a>
					    </div>
					</div>
					<div class="col-12 col-lg-6">
					    <div class="header-top-settings">
							<a onclick="logout()" style="font-size: small; float: right; color: white;"> 退出登录 </a>
					        <a href="register.html" style="font-size: small; float: right; color: white;"> 注册&nbsp;&nbsp;|&nbsp;&nbsp; </a>
					        <a href="login.html" style="font-size: small; float: right; color: white;"> 登录&nbsp;&nbsp;|&nbsp;&nbsp;</a>
					    </div>
					</div>
					<!-- Header Top Message End -->

                </div>
            </div>
        </div>
        <!-- Header Top End -->

        <!-- Header Bottom Start -->
        <div class="header-bottom">
            <div class="header-sticky">
                <div class="container">
                    <div class="row align-items-center position-relative">

                        <!-- Header Logo Start -->
                        <div class="col-lg-3 col-md-4 col-6">
                            <div class="header-logo">
                                <a href="index.html"><img src="assets/images/logo/logo.png" alt="Site Logo" /></a>
                            </div>
                        </div>
                        <!-- Header Logo End -->

                        <!-- Header Menu Start -->
                        <div class="col-lg-6 d-none d-lg-block">
                            <div class="main-menu">
                                <ul>
                                    <li class="has-children">
                                        <a href="index.html">首页</a>
                                    </li>
                                    <li class="has-children position-static">
                                         <a href="#">萌宠商城</a>
                                        <ul class="mega-menu" id="itemCat">
                                            <li class="mega-menu-col">
                                                <h4 class="mega-menu-title">狗狗</h4>
                                                <ul class="m-b-n10" id="dog">
                                                    
                                                </ul>
                                            </li>
                                            <li class="mega-menu-col">
                                                <h4 class="mega-menu-title">猫咪</h4>
                                                <ul class="m-b-n10" id="cat">
                                                   
                                                </ul>
                                            </li>
                                            <li class="mega-menu-col">
                                                <h4 class="mega-menu-title">其他</h4>
                                                <ul class="m-b-n10" id="other">
                                                   
                                                </ul>
                                            </li>
                                            <li class="mega-menu-col">
                                                <div class="megamenu-image">
                                                    <a href="shop.html">
                                                        <img class="fit-image" src="assets/images/header/mega-menu.png" alt="Megamenu Image">
                                                    </a>
                                                </div>
                                            </li>
                                        </ul>
                                    </li>
                                    <li class="has-children">
                                        <a href="#">萌宠论坛</a>
                                        <ul class="sub-menu">
                                            <li><a href="forum.html">浏览论坛</a></li>
                                            <li><a href="forum-details.html">话题详情</a></li>
                                        </ul>
                                    </li>
                                    <li class="has-children">
                                        <a href="#">萌宠日记</a>
                                        <ul class="sub-menu">
                                            <li><a href="diary.html">我的日记</a></li>
                                            <li><a href="diary-details.html">日记详情</a></li>
                                        </ul>
                                    </li>
                                    <li><a href="login.html">登录</a></li>
                                    <li><a href="register.html">注册</a></li>
                                </ul>
                            </div>
                        </div>
                        <!-- Header Menu End -->

                        <!-- Header Action Start -->
                        <div class="col-lg-3 col-md-8 col-6">
                            <div class="header-actions">

                                <!-- Header Action Search Button Start -->
                                <div class="header-action-btn header-action-btn-search d-none d-md-flex">
                                    <div class="action-execute">
                                        <a class="action-search-open" href="javascript:void(0)"><i class="icon-magnifier icons"></i></a>
                                        <a class="action-search-close" href="javascript:void(0)"><i class="ti-close"></i></a>
                                    </div>
                                    <!-- Search Form and Button Start -->
                                    <form class="header-search-form" >
                                        <input type="text" class="header-search-input" placeholder="搜索商品" value="" id="search">
                                        <button class="header-search-button" onclick="searchItem()"><i class="icon-magnifier icons"></i></button>
                                    </form>
                                    <!-- Search Form and Button End -->
                                </div>
                                <!-- Header Action Search Button End -->

                                <!-- Header My Account Button Start -->
                                <a onclick="accountAuth()" class="header-action-btn header-action-btn-wishlist"">
                                    <i class="icon-user icons"></i>
                                </a>
                                <!-- Header My Account Button End -->

                                <!-- Header Action Button Start -->
                                <div class="header-action-btn header-action-btn-cart d-none d-sm-flex">
                                    <a onclick="cartAuth()" class="cart-visible">
                                        <i class="icon-handbag icons"><span style="font-size: medium;">&nbsp;购物车</span></i>
                                    </a>
                                </div>
                                <!-- Header Action Button End -->
                            </div>
                        </div>
                        <!-- Header Action End -->

                    </div>
                </div>
            </div>
        </div>
        <!-- Header Bottom End -->

    </div>
    <!-- Header Section End -->

    <!-- Breadcrumb Area Start -->
    <div class="section breadcrumb-area bg-name-bright">
        <div class="container">
            <div class="row">
                <div class="col-12 text-center">
                    <div class="breadcrumb-wrapper">
                        <h2 class="breadcrumb-title">结算&nbsp;</h2>
                        <ul>
                          <li><a href="index.html">主页&nbsp;</a></li>
                            <li>结算页面&nbsp;</li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Breadcrumb Area End -->

    <!-- Checkout Section Start -->
    <div class="section section-margin">
        <div class="container">
            <div class="row">
                <div class="col-12">
                    <!-- Coupon Accordion Start -->
                    <div class="coupon-accordion">

                        <!-- Title Start -->
                        <h3 class="title">老用户? <a href="login.html">点击此处登录</a></h3>
                        <!-- Title End -->

                        <!-- Checkout Login Start -->
                        <div id="checkout-login" class="coupon-content">
                            <div class="coupon-info">

                                <!-- Form Start -->
                                <form action="#">
                                    <!-- Input Email Start -->
                                    <p class="form-row-first">
                                        <label>Username or email <span class="required">*</span></label>
                                        <input type="text">
                                    </p>
                                    <!-- Input Email End -->

                                    <!-- Input Password Start -->
                                    <p class="form-row-last">
                                        <label>Password <span class="required">*</span></label>
                                        <input type="password">
                                    </p>
                                    <!-- Input Password End -->

                                    <!-- Remember Password Start -->
                                    <p class="form-row m-b-10">
                                        <input type="checkbox" id="remember_me">
                                        <label for="remember_me" class="checkbox-label">Remember me</label>
                                    </p>
                                    <!-- Remember Password End -->

                                    <!-- Lost Password Start -->
                                    <p class="lost-password"><a href="#">Lost your password?</a></p>
                                    <!-- Lost Password End -->

                                </form>
                                <!-- Form End -->

                            </div>
                        </div>
                        <!-- Checkout Login End -->

                        <!-- Title Start -->
                        <h3 class="title">有优惠卷? 单击此处输入您的代码 <span id="showcoupon">&nbsp;</span></h3>
                        <!-- Title End -->

                        <!-- Checkout Coupon Start -->
                        <div id="checkout_coupon" class="coupon-checkout-content">
                            <div class="coupon-info">
                                <form action="#">
                                    <p class="checkout-coupon d-flex">
                                        <input placeholder="Coupon code" type="text">
                                        <input class="btn btn-primary btn-hover-dark rounded-0" value="Apply Coupon" type="submit">
                                    </p>
                                </form>
                            </div>
                        </div>
                        <!-- Checkout Coupon End -->

                    </div>
                    <!-- Coupon Accordion End -->
                </div>
            </div>
            <div class="row m-b-n20">
                <div class="col-lg-6 col-12 m-b-20">

                    <!-- Checkbox Form Start -->
                    <form action="#">
                        <div class="checkbox-form">
							
                            <!-- Checkbox Form Title Start -->
                            <h3 class="title">用户信息&nbsp;</h3>
                            <!-- Checkbox Form Title End -->

                            <div class="row">
								<table id="tab1">
									
								</table>
								

                                <!-- Select Country Name Start -->
                                <!-- <div class="col-md-12 m-b-30">
                                    <div class="country-select">
                                        <label>国家&nbsp; <span class="required">*</span></label>
                                        <select class="myniceselect nice-select wide rounded-0">
                                          <option data-display="Bangladesh">Bangladesh</option>
                                            <option value="uk">London</option>
                                            <option value="rou">Romania</option>
                                            <option value="fr">French</option>
                                            <option value="de">Germany</option>
                                            <option value="aus">Australia</option>
                                        </select>
                                    </div>
                                </div>
                                <!-- Select Country Name End -->

                                <!-- First Name Input Start -->
                               <!-- <div class="col-md-6">
                                    <div class="checkout-form-list">
                                        <label> <span class="required">名字*</span></label>
                                        <input placeholder="" type="text">
                                    </div>
                                </div> -->
                                <!-- First Name Input End -->

                                <!-- Last Name Input Start -->
                               <!-- <div class="col-md-6">
                                    <div class="checkout-form-list">
                                        <label> <span class="required">姓氏*</span></label>
                                        <input placeholder="" type="text">
                                    </div>
                                </div> -->
                                <!-- Last Name Input End -->

                                <!-- Company Name Input Start -->
                                <!-- <div class="col-md-12">
                                    <div class="checkout-form-list">
                                        <label>公司名&nbsp;</label>
                                        <input placeholder="" type="text">
                                    </div>
                                </div> -->
                                <!-- Company Name Input End -->

                                <!-- Address Input Start -->
                                <!-- <div class="col-md-12">
                                    <div class="checkout-form-list">
                                        <label> <span class="required">地址*</span></label>
                                        <input placeholder="街道/地址" type="text">
                                    </div>
                                </div> -->
                                <!-- Address Input End -->

                                <!-- Optional Text Input Start -->
                                <!-- <div class="col-md-12">
                                    <div class="checkout-form-list">
                                        <input placeholder="公寓,套房,单元等(可选)" type="text">
                                    </div>
                                </div> -->
                                <!-- Optional Text Input End -->

                                <!-- Town or City Name Input Start -->
                                <!-- <div class="col-md-12">
                                    <div class="checkout-form-list">
                                        <label> <span class="required">城镇/城市*</span></label>
                                        <input type="text">
                                    </div>
                                </div> -->
                                <!-- Town or City Name Input End -->

                                <!-- State or Country Input Start -->
                               <!-- <div class="col-md-6">
                                    <div class="checkout-form-list">
                                        <label> <span class="required">州/县*</span></label>
                                        <input placeholder="" type="text">
                                    </div>
                                </div> -->
                                <!-- State or Country Input End -->

                                <!-- Postcode or Zip Input Start -->
                                <!-- <div class="col-md-6">
                                    <div class="checkout-form-list">
                                        <label> <span class="required">邮政编码/邮编*</span></label>
                                        <input placeholder="" type="text">
                                    </div>
                                </div> -->
                                <!-- Postcode or Zip Input End -->

                                <!-- Email Address Input Start -->
                                <!-- <div class="col-md-6">
                                    <div class="checkout-form-list">
                                        <label> <span class="required">电子邮件地址*</span></label>
                                        <input placeholder="" type="email">
                                    </div>
                                </div> -->
                                <!-- Email Address Input End -->

                                <!-- Phone Number Input Start -->
                                <!-- <div class="col-md-6">
                                    <div class="checkout-form-list">
                                        <label> <span class="required">电话*</span></label>
                                        <input type="text">
                                    </div>
                                </div> -->
                                <!-- Phone Number Input End -->
								<!-- <div class="col-md-12">
									<div class="checkout-form-list create-acc">
									    <a  class="checkbox-label" onclick="getUser()" >获取订单信息</a>
									</div>
								</div> -->
                                <!-- Checkout Form List checkbox Start -->
                                <div class="col-md-12">
                                    <div class="checkout-form-list create-acc">
                                        <a  class="checkbox-label" href="register.html" >创建一个账户?</a>
                                    </div>
                                    <!-- <div id="cbox-info" class="checkout-form-list create-account">
                                        <p class="m-b-10">Create an account by entering the information below. If you are a returning customer please login at the top of the page.</p>
                                        <label>Account password <span class="required">*</span></label>
                                        <input placeholder="Password" type="password">
                                    </div> -->
                                </div>
                                <!-- Checkout Form List checkbox End -->

                            </div>

                            <!-- Different Address Start -->
                            <div class="different-address">
                                <!-- Ship Different Title Checkbox Start -->
                                <!-- <div class="ship-different-title">
                                    <div>
                                        <input id="ship-box" type="checkbox">
                                        <label for="ship-box" class="checkbox-label">运送到不同的地址?</label>
                                    </div>
                                </div> -->
                                <!-- Ship Different Title Checkbox End -->

                                <!-- Ship Box Info Start -->
                                <div id="ship-box-info" class="row m-t-10">

                                    <!-- Select Country Name Start -->
                                    <div class="col-md-12">
                                        <div class="myniceselect country-select clearfix">
                                            <label>Country <span class="required">*</span></label>
                                            <select class="myniceselect nice-select wide rounded-0">
                                                <option data-display="Bangladesh">Bangladesh</option>
                                                <option value="uk">London</option>
                                                <option value="rou">Romania</option>
                                                <option value="fr">French</option>
                                                <option value="de">Germany</option>
                                                <option value="aus">Australia</option>
                                            </select>
                                        </div>
                                    </div>
                                    <!-- Select Country Name End -->

                                    <!-- First Name Input Start -->
                                    <div class="col-md-12">
                                        <div class="checkout-form-list">
                                            <label>First Name <span class="required">*</span></label>
                                            <input placeholder="" type="text">
                                        </div>
                                    </div>
                                    <!-- First Name Input End -->

                                    <!-- Last Name Input Start -->
                                    <div class="col-md-12">
                                        <div class="checkout-form-list">
                                            <label>Last Name <span class="required">*</span></label>
                                            <input placeholder="" type="text">
                                        </div>
                                    </div>
                                    <!-- Last Name Input End -->

                                    <!-- Company Name Start -->
                                    <div class="col-md-12">
                                        <div class="checkout-form-list">
                                            <label>Company Name</label>
                                            <input placeholder="" type="text">
                                        </div>
                                    </div>
                                    <!-- Company Name End -->

                                    <!-- Address Input Start -->
                                    <div class="col-md-12">
                                        <div class="checkout-form-list">
                                            <label>Address <span class="required">*</span></label>
                                            <input placeholder="Street address" type="text">
                                        </div>
                                    </div>
                                    <!-- Address Input End -->

                                    <!-- Optional Text Start -->
                                    <div class="col-md-12">
                                        <div class="checkout-form-list">
                                            <input placeholder="Apartment, suite, unit etc. (optional)" type="text">
                                        </div>
                                    </div>
                                    <!-- Optional Text End -->

                                    <!-- Town or City Input Start -->
                                    <div class="col-md-12">
                                        <div class="checkout-form-list">
                                            <label>Town / City <span class="required">*</span></label>
                                            <input type="text">
                                        </div>
                                    </div>
                                    <!-- Town or City Input End -->

                                    <!-- State or Country Input Start -->
                                    <div class="col-md-12">
                                        <div class="checkout-form-list">
                                            <label>State / County <span class="required">*</span></label>
                                            <input placeholder="" type="text">
                                        </div>
                                    </div>
                                    <!-- State or Country Input End -->

                                    <!-- Postcode or Zip Input Start -->
                                    <div class="col-md-12">
                                        <div class="checkout-form-list">
                                            <label>Postcode / Zip <span class="required">*</span></label>
                                            <input placeholder="" type="text">
                                        </div>
                                    </div>
                                    <!-- Postcode or Zip Input End -->

                                    <!-- Email Address Input Start -->
                                    <div class="col-md-12">
                                        <div class="checkout-form-list">
                                            <label>Email Address <span class="required">*</span></label>
                                            <input placeholder="" type="email">
                                        </div>
                                    </div>
                                    <!-- Email Address Input End -->

                                    <!-- Phone Number Input Start -->
                                    <div class="col-md-12">
                                        <div class="checkout-form-list">
                                            <label>Phone <span class="required">*</span></label>
                                            <input type="text">
                                        </div>
                                    </div>
                                    <!-- Phone Number Input End -->

                                </div>
                                <!-- Ship Box Info End -->

                                <!-- Order Notes Textarea Start -->
                                <div class="order-notes m-t-15 m-b-n10">
                                    <div class="checkout-form-list checkout-form-list-2">
                                        <label>订单备注&nbsp;</label>
                                        <textarea id="checkout-mess" cols="30" rows="10" placeholder="关于您的订单说明,例如交货的特殊说明."></textarea>
                                    </div>
                                </div>
                                <!-- Order Notes Textarea End -->

                            </div>
                            <!-- Different Address End -->
                        </div>
                    </form>
                    <!-- Checkbox Form End -->

                </div>

                <div class="col-lg-6 col-12 m-b-20">

                    <!-- Your Order Area Start -->
                    <div class="your-order-area border">

                        <!-- Title Start -->
                        <h3 class="title">您的订单</h3>
                        <!-- Title End -->

                        <!-- Your Order Table Start -->
                        <div class="your-order-table table-responsive">
                            <table class="table">

                                <!-- Table Head Start -->
                                <thead>
                                    <tr class="cart-product-head">
                                        <th class="cart-product-name text-start">商品信息</th>
                                    </tr>
                                </thead>
                                <!-- Table Head End -->

                                <!-- Table Body Start -->
                                <tbody id="tab2">
									<!-- <tr>
									    <th><button onclick="getItem()">获取订单信息</button></th>
									</tr> -->
                                    <!-- <tr class="cart_item">
                                        <td class="cart-product-name text-start ps-0"> 一些冬季系列<strong class="product-quantity"> × 2</strong></td>
                                        <td class="cart-product-total text-end pe-0"><span class="amount">£145.00</span></td>
                                    </tr>
                                    <tr class="cart_item">
                                        <td class="cart-product-name text-start ps-0"> <strong class="product-quantity"> 小规模风格× 4</strong></td>
                                        <td class="cart-product-total text-end pe-0"><span class="amount">£204.00</span></td>
                                    </tr>
                                    <tr class="cart-subtotal">
                                        <th class="text-start ps-0">购物车小计&nbsp;</th>
                                        <td class="text-end pe-0"><span class="amount">£349.00</span></td>
                                    </tr>
                                    <tr class="order-total">
                                        <th class="text-start ps-0">合计订单</th>
                                        <td class="text-end pe-0"><strong><span class="amount">£349.00</span></strong></td>
                                    </tr> -->
                                </tbody>
                                <!-- Table Footer End -->

                            </table>
                        </div>
                        <!-- Your Order Table End -->

                        <!-- Payment Accordion Order Button Start -->
                        <div class="payment-accordion-order-button">
                            <div class="payment-accordion">
                                <div class="single-payment">
                                    <h5 class="panel-title m-b-15">
                                        <a class="collapse-off" data-bs-toggle="collapse" href="#collapseExample" aria-expanded="false" aria-controls="collapseExample">
                                      支付方式银行转款</a>
                                    </h5>
                                    <div class="collapse show" id="collapseExample">
                                        <div class="card card-body rounded-0">
                                            <p>请您确定核定好收货信息以及订单信息,确认无误后请支付本次购买的商品费用.我们将尽快为您核实发货!感谢您的支持!</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="single-payment">
                                    <h5 class="panel-title m-b-15">
                                        <a class="collapse-off" data-bs-toggle="collapse" href="#collapseExample-2" aria-expanded="false" aria-controls="collapseExample-2">
                                        检查付款.
                                    </a>
                                    </h5>
                                    <div class="collapse" id="collapseExample-2">
                                        <div class="card card-body rounded-0">
                                            <p>Make your payment directly into our bank account. Please use your Order ID as the payment reference. Your order won’t be shipped until the funds have cleared in our account.</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="single-payment">
                                    <h5 class="panel-title m-b-15">
                                        <a class="collapse-off" data-bs-toggle="collapse" href="#collapseExample-3" aria-expanded="false" aria-controls="collapseExample-3">
                                        宝贝.
                                    </a>
                                    </h5>
                                    <div class="collapse" id="collapseExample-3">
                                        <div class="card card-body rounded-0">
                                            <p>Make your payment directly into our bank account. Please use your Order ID as the payment reference. Your order won’t be shipped until the funds have cleared in our account.</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="order-button-payment">
                                <button class="btn btn-primary btn-hover-dark rounded-0 w-100" onclick="pay()">立即支付&nbsp;</button>
                            </div>
                        </div>
                        <!-- Payment Accordion Order Button End -->
                    </div>
                    <!-- Your Order Area End -->
                </div>
            </div>
        </div>
    </div>
    <!-- Checkout Section End -->

    <!-- Footer Section Start -->
    <footer class="section footer-section">
        <!-- Footer Top Start -->
        <div class="footer-top bg-name-bright section-padding">
            <div class="container">
                <div class="row m-b-n40">
                    <div class="col-12 col-sm-6 col-lg-3 m-b-40" data-aos="fade-up" data-aos-duration="1000">
                        <div class="single-footer-widget">
                            <h1 class="widget-title">关于我们</h1>
                            <p class="desc-content">然后疼痛就会停止，疼痛就会受到折磨。</p>
                            <!-- Soclial Link Start -->
                            <div class="widget-social justify-content-start m-b-n10">
                                <a title="Twitter" href="#/"><i class="icon-social-twitter"></i></a>
                                <a title="Instagram" href="#/"><i class="icon-social-instagram"></i></a>
                                <a title="Linkedin" href="#/"><i class="icon-social-linkedin"></i></a>
                                <a title="Skype" href="#/"><i class="icon-social-skype"></i></a>
                                <a title="Dribble" href="#/"><i class="icon-social-dribbble"></i></a>
                            </div>
                            <!-- Social Link End -->
                        </div>
                    </div>
                    <div class="col-12 col-sm-6 col-lg-3 m-b-40" data-aos="fade-up" data-aos-duration="1200">
                        <div class="single-footer-widget">
                            <h2 class="widget-title">有用的链接</h2>
                            <ul class="widget-list">
                              <li><a href="wishlist.html">帮助和联系我们</a></li>
                                <li><a href="contact.html">退货和退款</a></li>
                                <li><a href="contact.html">线上商店</a></li>
                                <li><a href="contact.html">条款与条件</a></li>
                            </ul>
                        </div>
                    </div>
                    <div class="col-12 col-sm-6 col-lg-3 m-b-40" data-aos="fade-up" data-aos-duration="1400">
                        <div class="single-footer-widget">
                            <h2 class="widget-title">帮助</h2>
                            <ul class="widget-list">
                              <li><a href="wishlist.html">愿望清单</a></li>
                                <li><a href="contact.html">定价计划</a></li>
                                <li><a href="contact.html">物流跟踪</a></li>
                                <li><a href="contact.html">退换商品</a></li>
                            </ul>
                        </div>
                    </div>
                    <div class="col-12 col-sm-6 col-lg-3 m-b-40" data-aos="fade-up" data-aos-duration="1600">
                        <div class="single-footer-widget">
                            <h2 class="widget-title">发送时事通讯</h2>
                            <div class="widget-body">
                              <p class="desc-content m-b-20">订阅我们的时事通讯，首次购买可享受10%的折扣。</p>
                                <!-- Newsletter Form Start -->
                                <div class="newsletter-form-wrap p-t-5">
                                    <form id="mc-form" class="mc-form">
                                        <input type="email" id="mc-email" class="form-control email-box" placeholder="demo@example.com" name="EMAIL">
                                        <button id="mc-submit" class="newsletter-btn" type="submit">发送</button>
                                    </form>
                                    <!-- mailchimp-alerts Start -->
                                    <div class="mailchimp-alerts text-centre">
                                        <div class="mailchimp-submitting"></div><!-- mailchimp-submitting end -->
                                        <div class="mailchimp-success text-success"></div><!-- mailchimp-success end -->
                                        <div class="mailchimp-error text-danger"></div><!-- mailchimp-error end -->
                                    </div>
                                    <!-- mailchimp-alerts end -->
                                </div>
                                <!-- Newsletter Form End -->
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- Footer Top End -->
    </footer>
    <!-- Footer Section End -->

    <script src="assets/js/vendor.min.js"></script>
    <script src="assets/js/plugins.min.js"></script>

    <!--Main JS-->
    <script src="assets/js/main.js"></script>
</body>

</html>